<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>左导航菜单</title>
    <style type="text/css">
        li{list-style: none; line-height: 22px; cursor: pointer;}
        .current{background: #6cf; font-weight: bold; color: #fff;}
    </style>
</head>
<body>
<ul>
    <li id="current">jQuery简介</li>
    <li>jQuery语法</li>
    <li>jQuery选择器</li>
    <li>jQuery事件与动画</li>
    <li>jQuery方法</li>
</ul>
<script src="js/jquery-1.12.4.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $("li").click(function(){
            $("#current").addClass("current");
        });
    });
</script>
</body>
</html>